import { createApp } from 'vue'
import pinia from './stores' // store 仓库
import ElementPlus from 'element-plus'
import zhCn from 'element-plus/es/locale/lang/zh-cn' // 语言包
import 'element-plus/dist/index.css' // element-plus 样式 css
import App from './App.vue' // 跟组件
import router from './router' // 路由
import './styles/index.scss' // 全局的css
import ElSvg from './components/SvgIcon/ElSvg' // 图标组件
import './permission' // 导航守卫
import './mock' // 使用mock
// 注册全局三级分类组件
import CategorySelector from '@/components/CategorySelector/index.vue'
// 全局注册订单弹框组件
import OrderPupup from '@/components/OrderPup-up/index.vue'
// 全局注册图表组件
import CommonCard from '@/views/home/components/Topview/components/CommonCard/index.vue'
import { vueEcharts } from '@/plugins/echarts'

// 全局注册搜索组件
import SearchPupup from '@/components/SearchPupup/index.vue'

// 全局注册搜索弹框
import Rank from '@/components/Rank/index.vue'

// Vue.directive('focus', {
//   inserted: function (el) {
//     console.log(el)
//     // el表示指令所绑定的元素
//     el.querySelector('input').focus()
//   }
// })

// app.directive('onceClick',{
//     mounted(el, binding, vnode) {
//         el.addEventListener('click', () => {
//             if (!el.disabled) {
//                 el.disabled = true;
//                 setTimeout(() => {
//                     el.disabled = false;
//                 }, binding.value || 1000);
//             }
//         });
//     }
const app = createApp(App)
// 将组件注册成全局组件
app.component('CategorySelector', CategorySelector)
app.component('OrderPup-up', OrderPupup)
app.component('CommonCard', CommonCard)
app.component('SearchPupup', SearchPupup)
app.component('Rank', Rank)
app.use(vueEcharts)
// 注册一个全局自定义指令
app.directive('focus', {
  // 挂载之后进行绑定
  mounted(el) {
    // el表示指令所绑定的元素
    el.querySelector('input').focus()
  }
})
ElSvg(app)

app
  .use(pinia)
  .use(router)
  .use(ElementPlus, {
    locale: zhCn
  })
  .mount('#app')
